let appHobby = {
  template: `<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
    <h1 class="page-header">{{ test }}</h1>
    <div class="row placeholders">
      <div class="col-xs-6 col-sm-3 placeholder" v-for="(item, index) in datalist">
        <img
          src=""
          width="200"
          height="200"
          class="img-responsive"
          alt="Generic placeholder thumbnail"
        />
        <h4>{{ item }}</h4>
        <span class="text-muted"><a href="###" @click="delHobby(index)">删除</a></span>
      </div>
    </div></div>`,
  props: ["datalist", "test", "delHobby"], //3.子组件：这里写的是刚才在父组件定义的自定义属性名；就是类似data，但是这里的数据是用于接收外部传入的
  // props: {
  //   //可以用对象接收父组件传过来的数据，更加严谨的方式
  //   datalist: Array,
  //   test: String,
  //   delHobby: Function,
  // },
  // props: {
  //   //高级写法
  //   test: {
  //     type: String,
  //     required: true, //必须传
  //     default: "仪表盘",
  //   },
  //   datalist: {
  //     type: Array,
  //     required: true,
  //     default: [],
  //   },
  // },
  data() {
    return {
      msg: "测试一下，我appHobby组件",
      // likes: ["看书", "王者", "电影", "撸代码"],
    };
  },
};
